
import React, { Component, PropTypes } from 'react';
import { routerRedux } from 'dva/router';
import { connect } from 'dva';
import { Link } from 'dva/router';
import Funnel from '../components/charts/Funnel';
import styles from './HomePage.less';
import MainLayout from '../components/MainLayout/MainLayout';
import {Row, Col,Tooltip,Icon} from 'antd';

class MemberLevel extends Component {
	constructor(props) {
	      super(props);
	  }
	componentWillMount() {
		window.localStorage.setItem("imgType", "member_level");
                     	window.localStorage.setItem("imgTypeValue", "");

                         this.props.dispatch({
		            type: 'homePage/query',
		            payload: ""
		});
		this.props.dispatch({
		            type: 'homePage/memberLevelQuery',
		            payload: ""
		});
		this.props.dispatch({
		            type: 'homePage/timeListQuery',
		            payload: ""
		});
	 };
	
	render(){
		const {count,timeListData} = this.props.homePage;
		const TimeListProps = {
			data: timeListData,
			count: count
		};
	  return (
	    <MainLayout isShowLeft="showTimeList" data={TimeListProps}>
	    <div className={styles.wrap}>
	      <Row type="flex" justify="space-between" gutter={16} className="top_tit">
		      <Col span={8}>
		      	<a href="#">生命周期</a>
		      </Col>
		      <Col span={8}>
		      	<Link to="/MemberLevel" className="on">会员等级</Link>
		      </Col>
		      <Col span={8}>
		      	<Link to="/UserGroup">自定义用户组</Link>
		      </Col>
		    </Row>
		    <div className={styles.ui_wrap}>
		    	<h3 className={styles.ui_tit}>
		    		会员等级&nbsp;
		    		<Tooltip placement="right" title={(<span>会员等级是用户与品牌线下互动程度、用户价值的体现，<br />是用户与品牌的关系从一个等级向另一个等级变更的过程</span>)}>
			          <Icon type="question-circle-o" className={styles.anticon}/>
			        </Tooltip>
		    	</h3>
		    	<div className={styles.chart_box} id="chart_box">
		    		<Funnel data={this.props.homePage.memberLevelData} />
		    	</div>
		    </div>
		    </div>
	    </MainLayout>
	  );
	 }
}

MemberLevel.propTypes = {
};

function mapStateToProps({ homePage }) {
  return {
    homePage: {...homePage},
  };
}

export default connect(mapStateToProps)(MemberLevel);